<!DOCTYPE html>
<!--把html 的名称空间，改成：xmlns:th="http://www.thymeleaf.org" 会有语法提示-->
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:easyui="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
    <title>人员编辑</title>
    <script type="text/javascript" src="../../static/easyui/boot.js" th:src="@{/static/easyui/boot.js}"></script>
</head>
<body>
<div class="pt-info container">
    <form id="frmMain" class="form-horizontal" action="/staff/save.do" method="post" style="margin: 50px 0;">
        <div class="pt-content row block-title">二行信息</div>
        <div class="pt-content row">
            <easyui:input label="文本框" name="sex1" vtype="text" required="true" readonly="false" th:value="${id}" width="col-md-6 col-sm-12"/>
            <easyui:input label="文本框+按钮" name="sex8" vtype="text" required="true" readonly="false" value="111"/>
            <easyui:input label="数字输入框" name="sex2" vtype="number" required="true" readonly="false" value="" min="0" max="999" precision="2"/>
            <easyui:input label="日期输入框" name="sex3" vtype="datebox" required="true" readonly="false" value=""/>
            <easyui:input label="日期时间输入框" name="sex4" vtype="datetimebox" required="true" readonly="false" value=""/>
            <easyui:select label="下拉框" name="sex5" required="true" dataSource="[{
                label: 'java',
                value: 'Java'
            },{
                label: 'perl',
                value: 'Perl'
            },{
                label: 'ruby',
                value: 'Ruby'
            }]" readonly="false" value="" valueField="value" textField="label"/>
            <easyui:select label="下拉框URL" name="sex6" required="true" url="/api/login/select" readonly="false" value="" valueField="value" textField="label"/>
            <easyui:input label="多行文本框" name="sex7" vtype="textarea" required="true" readonly="false" value="111" width="col-sm-12"
                          labelWidth="col-sm-5 col-md-2" inputWidth="col-sm-7 col-md-10"/>
            <easyui:checkbox label="复选框" vtype="checkbox" name="sex33" required="true" dataSource="1,中国|2,美国" readonly="false" value="1"/>
            <easyui:checkbox label="单选框" vtype="radio" name="sex35" required="true" dataSource="1,中国|2,美国" readonly="true" value="2"/>
            <div class="pt-tool row">
                <easyui:button label="新增" vtype="add" name="butAdd"/>
                <easyui:button label="删除" vtype="del" name="butDel"/>
                <easyui:button label="编辑" vtype="edit" name="butEdit"/>
                <easyui:button label="保存" vtype="save" name="butSave"/>
                <easyui:button label="关闭" vtype="close" name="butClose"/>
                <easyui:button label="查询" vtype="search" name="butSearch"/>
                <easyui:button label="刷新" vtype="reload" name="butReload"/>
                <easyui:button label="打印" vtype="print" name="butPrint"/>
                <easyui:button label="自定义按钮图标" iconCls="icon-help" name="butPrint1"/>
            </div>

        </div>

        <div class="pt-content row block-title">一行信息</div>
        <div class="pt-content row">
            <easyui:input label="文本框" name="sex1" vtype="text" required="true" readonly="false" value="111" width="col-md-10"/>
            <easyui:input label="文本框+按钮" name="sex9" vtype="text" required="true" readonly="false" value="111"  width="col-md-10"/>
            <easyui:input label="数字输入框" name="sex2" vtype="number" required="true" readonly="false" value="" min="0" max="999" precision="2" width="col-md-10"/>
            <easyui:input label="日期输入框" name="sex3" vtype="datebox" required="true" readonly="false" value="" width="col-md-10"/>
            <easyui:input label="日期时间输入框" name="sex4" vtype="datetimebox" required="true" readonly="false" value="" width="col-md-10"/>
            <easyui:select label="下拉框" name="sex5" required="true" dataSource="[{
                label: 'java',
                value: 'Java'
            },{
                label: 'perl',
                value: 'Perl'
            },{
                label: 'ruby',
                value: 'Ruby'
            }]" readonly="false" value="" valueField="value" textField="label" width="col-md-10"/>
            <easyui:select label="下拉框URL" name="sex6" required="true" url="/api/login/select" readonly="false" value="" valueField="value" textField="label" width="col-md-10"/>
            <easyui:input label="多行文本框" name="sex7" vtype="textarea" required="true" readonly="false" value="111" width="col-md-10"/>
            <easyui:checkbox label="复选框" vtype="checkbox" name="sex38" required="true" dataSource="1,中国|2,美国" readonly="false" value="2" width="col-md-10"/>
            <easyui:checkbox label="单选框" vtype="radio" name="sex37" required="true" dataSource="1,中国|2,美国" readonly="true" value="1" width="col-md-10"/>
        </div>

    </form>
</div>
</body>
</html>
<script type="text/javascript">
    $(document).ready(function () {
        //$('#sex').textbox('readonly',false);  // 启用只读模式
        buttoneditTextbox("sex8",function () {

        });
        buttoneditTextbox("sex9",function () {

        });
        //保存
        $('#butSave').click(function(){
            var c= $("#frmMain").serialize();
            console.log(c)

        });
    });
</script>